<template>
  <view class="container">
    <u-navbar :title="title"></u-navbar>
    <view v-if="status == 1" class="content">
      <view class="warning">
        注：拒绝合作确认后，本次需求报名终止，平台确认后将报名费原路返回
      </view>
      <view class="con-area">
        <view class="">
          拒绝原因
          <text style="color: #ff4445">*</text>
        </view>
        <textarea
          v-model="form.note"
          placeholder="请简要描述拒绝合作原因"
          name=""
          id=""
          cols="30"
          rows="10"
        ></textarea>
      </view>
      <view class="con-area">
        <view class="">
          相关证明
          <text style="color: #ff4445">*</text>
          <text style="color: #999999; font-size: 24rpx">（可选填）</text>
          <u-upload
            ref="uUpload"
            :action="upUrl"
            :file-list="fileList"
            :before-upload="beforeFileUpload"
            @on-remove="onFileRemove"
          ></u-upload>
        </view>
      </view>
    </view>
    <view v-if="status == 2" class="content">
      <view class="warning">
        注：确认施工工作已完成，申诉机会只有一次，请认真填写真实客观的事件情况，申诉后施工单将终止，平台将介入
      </view>
      <view class="con-area">
        <view class="">
          申诉原因
          <text style="color: #ff4445">*</text>
        </view>
        <textarea placeholder="请简描述申诉原因" name="" id="" cols="30" rows="10"></textarea>
      </view>
      <view class="con-area">
        <view class="">
          相关证明
          <text style="color: #ff4445">*</text>
          <text style="color: #999999; font-size: 24rpx">（可选填）</text>
          <u-upload
            :action="'http://ww'"
            :file-list="fileList"
            :before-upload="beforeFileUpload"
            @on-remove="onFileRemove"
          ></u-upload>
        </view>
      </view>

      <view class="view-item">
        <view class="">
          联系方式
          <text style="color: #ff4445">*</text>
        </view>
        <input type="text" placeholder="请输入联系方式" />
      </view>
    </view>

    <view v-if="status == 3" class="content">
      <view class="warning"> 注：为确保需求发布放验收顺利通过，确认施工已完成再申请提交</view>

      <view class="con-area">
        <view class="">
          上传完成施工照片
          <text style="color: #ff4445">*</text>
          <text style="color: #999999; font-size: 24rpx">（可选填）</text>
          <u-upload
            :action="'http://ww'"
            :file-list="fileList"
            :before-upload="beforeFileUpload"
            @on-remove="onFileRemove"
          ></u-upload>
        </view>
      </view>
    </view>
    <view class="floor">
      <view @click="submit" class="submit-btn"> 确认提交</view>
    </view>
  </view>
</template>

<script>
import { BASE_URL, UP_URL } from '@/common/config.js'

export default {
  data() {
    return {
      id: '',
      title: '拒绝合作',
      status: 1,
      fileList: [],
      form: {
        projectId: '',
        note: '',
        picUrls: []
      },
      upUrl: BASE_URL + UP_URL
    }
  },
  onLoad(options) {
    this.form.projectId = options.id
    this.status = 1
    // if(this.status == 1){
    // 	this.title = '拒绝合作'
    // }else if(this.status == 2){
    // 	this.title = '争议申诉'
    // }else{
    // 	this.title = '申请验收'
    // }
  },
  methods: {
    beforeFileUpload(_index, list) {
      this.fileList = list
    },
    onFileRemove(_index, list) {
      this.fileList = list
    },
    submit() {
      if (!this.form.note) {
        this.$u.toast('拒绝原因不也能为空！')
        return
      }
      this.$u.put('/app-api/construction/project-info/supplier-refuse', this.form).then((res) => {
        this.$u.toast('提交成功')
        setTimeout(() => {
          uni.navigateBack()
        }, 800)
      })
    }
  }
}
</script>

<style>
@import url('../../style/btn.css');

page {
  background-color: #f7f7f7;
}

.content {
  background-color: #fff;
}

.warning {
  padding: 20rpx;
  background-color: #f5e8e6;
  color: #f54831;
  font-size: 26rpx;
}

.con-area {
  padding: 20rpx;
}

.view-item {
  display: flex;
  background-color: #fff;
  margin: 20rpx 0;
  padding: 20rpx;
}

.view-item view {
  flex: 2;
}

.view-item input {
  flex: 8;
}

.floor {
  position: absolute;
  bottom: 350rpx;
  left: 50%;
  transform: translateX(-50%);
}
</style>
